<template>
  <div class="Modifypass">
    <section class="main">
      <el-form :model="modifypass" :inline="true" class="demo-form-inline">
        <el-form-item label="用户名" v-bind:label-width="formLabelWidth">
          <el-input v-model="userInfo.name" placeholder="用户名"></el-input>
        </el-form-item>
        <el-form-item label="原密码" v-bind:label-width="formLabelWidth">
          <el-input type="password" v-model="userInfo.password" placeholder="原密码"></el-input>
        </el-form-item>
        <el-form-item label="新密码" v-bind:label-width="formLabelWidth">
          <el-input v-model="modifypass.newPass" placeholder="新密码"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" v-bind:label-width="formLabelWidth">
          <el-input v-model="modifypass.newPassAgain" placeholder="确认密码"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini">取 消</el-button>
          <el-button size="mini" type="primary" @click="modifyPass">确 定</el-button>
        </el-form-item>
      </el-form>
    </section>
  </div>
</template>

<script type="text/javascript" src="../../api/usermg/modifypass.js"></script>

<style lang="scss">
.Modifypass {
  flex: 1;
  > section {
    &.main {
      padding: 8px 20px;
      width: 60%;
      margin: 5% 15%;
      .el-form {
        //background-color: #1f2548;
        display: flex;
        flex-direction: column;
        .el-form-item {
          padding: 10px;
          margin: 10px;
          text-align: center;
          .el-input__inner {
            height: 30px;
            line-height: 30px;
            background-color: #161836;
            color: #fff;
            border: 1px solid #85899c;
          }
          .el-form-item__content {
            width: 50%;
          }
          .el-button--default {
            background-color: #161836;
            font-size: 14px;
            padding: 8px 16px;
            color: #85899c;
            border: 1px solid #85899c;
          }
          .el-button--default:hover,
          .el-button--default:focus {
            background-color: #161836;
            font-size: 14px;
            padding: 8px 16px;
            color: #fff;
            border: 1px solid #fff;
          }
          .el-button--primary {
            padding: 8px 16px;
            font-size: 14px;
            background-color: #44abf5;
            border: 1px solid #44abf5;
            color: #fff;
          }
        }
      }
    }
  }
}
</style>
